<template>
  <view id="box">
    <image src="/static/image/mybg.jpg" mode="" />
    <view class="main-title c-pt40 c-fs-30 c-fw600 c-color-222">我们将以短信的形式将验证码发送给您，请您注意查收</view>

    <view class="c-mt40 c-flex c-flex-between">
      <u-message-input
        class="c-width-100"
        :focus="true"
        :maxlength="6"
        :bold="true"
        @change="change"
        @finish="finish"
      ></u-message-input>
    </view>
    <view class="c-text-right c-mt30" @click="sendCode">
      重新发送
      <u-count-down :show-hours="false" class="c-ml10" :color="'#F3651F'" :timestamp="timestamp"></u-count-down>
    </view>
    <view class="c-mt100"></view>
    <u-button
      :hair-line="false"
      class="c-mt100"
      :custom-style="{
        width: '100%',
        height: '105rpx',
        fontSize: '35rpx',
        fontFamily: 'PingFang SC',
        fontWeight: 'bold',
        color: '#fff',
        backgroundColor: '#F3651F',
        border: 'none',
        borderRadius: '30rpx'
      }"
      @click="login"
      >登录</u-button
    >
  </view>
</template>

<script>
  import url from '../../common/util/url'
  import user from '../../services/user'
  import message from './message.vue'
  export default {
    components: {
      message
    },
    data() {
      return {
        value: '',
        timestamp: 60,
        yanzhengma: ''
      }
    },
    methods: {
      change(e) {
        this.yanzhengma = e
      },
      finish(e) {
        this.yanzhengma = e
      },
      sendCode() {
        let params = url.getCurrentPageParam()
        user.sendCode(params.phone).then(data => {
          if (data === 0) {
            setTimeout(() => {
              wx.showToast({
                title: '发送成功',
                duration: 2000
              })
            }, 0)
          }
        })
      },
      login() {
        let params = url.getCurrentPageParam()
        let that = this
        wx.getUserProfile({
          desc: '获取您的头像昵称数据',
          success(data) {
            if (data.errMsg === 'getUserProfile:ok') {
              console.log(uni.getStorageSync('shareUserId'))
              let obj = {
                mobile: params.phone,
                mobileCode: that.yanzhengma,
                sex: data.userInfo.gender,
                avatar: data.userInfo.avatarUrl,
                openid: uni.getStorageSync('openid'),
                username: data.userInfo.nickName,
                inviteUserId: uni.getStorageSync('shareUserId')
              }
              console.log(obj.inviteUserId)
              user.register(obj).then(data => {
                wx.showToast({
                  title: '注册成功',
                  duration: 2000,
                  success: () => {
                    let path = '/pages/my/index'
                    if (uni.getStorageSync('userId')) {
                      path = path + '&userId=' + uni.getStorageSync('userId')
                    }
                    uni.setStorageSync('sharePage', path)
                    wx.switchTab({
                      url: `/pages/my/index`
                    })
                  }
                })
              })
            }
          },
          fail(res) {
            console.log(res)
          }
        })
      }
    },
    mounted() {}
  }
</script>

<style scoped>
  #box >>> .u-char-box {
    margin: auto;
  }
  #box >>> .u-char-item {
    border: 1px solid #ccc !important;
    border-radius: 20rpx !important;
    width: 86rpx !important;
    height: 86rpx !important;
  }
</style>
<style lang="scss" scope>
  #box {
    padding: 80rpx 30rpx 0;
    image {
      width: 170rpx;
      height: 170rpx;
      border-radius: 24rpx;
    }
    .item {
      border: 1px solid #ccc;
      padding: 0px;

      text-align: center;
      line-height: 50px;
      border-radius: 5px;
      font-size: 20px;
      font-weight: 600;
    }
  }
</style>
